<template>
	<view>
		<u-navbar :is-back="isBack" :back-icon-color="backIconColor" :back-text="backText" :title="title"
			:background="background" :back-text-style="backTextStyle" :immersive="immersive"
			:border-bottom="borderBottom" :title-color="titleColor" :custom-back="backf">
			<slot></slot>
			<view slot="right">
				<slot name="right"></slot>
			</view>
		</u-navbar>
	</view>
</template>

<script>
	export default {
		props: {
			
			title: {
				type: String,
				default: ''
			},
			isBack: {
				type: Boolean,
				default: true
			},
			borderBottom: {
				type: Boolean,
				default: false
			},
			titleColor:{
				type: String,
				default: '#fff'
			},
			backIconColor: {
				type: String,
				default: '#fff'
			},
			backText: {
				type: String,
				default: '返回'
			},
			backTextStyle: {
				type: Object,
				default: () => {
					return {
						color: '#fff'
					}
				}
			},
			immersive: {
				type: Boolean,
				default: false
			},
			background: {
				type: Object,
				default: () => {
					return {
						// backgroundImage: 'linear-gradient(45deg, rgb(28, 187, 180), rgb(141, 198, 63))'
						background: '#23bbb3'
					}
				}
			}
		},
		data() {
			return {
				// background: {
				// 	// 渐变色
				// 	backgroundImage: 'linear-gradient(45deg, rgb(28, 187, 180), rgb(141, 198, 63))'
				// }
			}
		},
		methods: {
			backf(v) {
				let canNavBack = getCurrentPages()
				if (canNavBack && canNavBack.length > 1) {
					uni.navigateBack()
				} else {
					let path = 'pages/index/index'
					uni.$u.route({
						type: 'switchTab',
						url: path
					})
				}
			}
		}
	}
</script>

<style scoped lang="scss">
</style>